<!-- eslint-disable vue/multi-word-component-names -->
<template>
  <div class="evaluate-container">
    <van-empty description="暂无过往面试评价" v-if="cp_titles.length === 0" />
    <van-tabs v-model:active="active" :show-header="showTabs" v-else>
      <van-tab v-for="(title, index) of cp_titles" :title="title" :key="index">
        <EvaluateInfoView :reportInfo="cp_reportInfo[index]" />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script setup>
import { computed } from "vue";
import { useInterviewStore } from "@/store";
import EvaluateInfoView from "./EvaluateInfoView.vue";

const interviewStore = useInterviewStore();

const cp_reportInfo = computed(() => {
  if (!interviewStore.reportInfo) return [];
  return interviewStore.reportInfo.reports || [];
});

const cp_titles = computed(() => {
  const reportInfo = interviewStore.reportInfo;
  if (!reportInfo || reportInfo === undefined) {
    return [];
  }
  const reports = reportInfo.reports;
  return reports.map((item) => item.roundName);
});

const showTabs = computed(() => {
  const reports = interviewStore.reportInfo.reports;
  return reports.length > 1;
});
</script>

<style scoped></style>
